<script setup lang="ts">
import comA from './components/com-a.vue'
import comB from './components/com-b.vue'
import { ref } from 'vue'
// vue3 中 v-model语法糖  v-model='count'
// 相当于写了   :modelValue="count"  @update:modelValue="count=$event"
const count = ref(0)
// v-model:msg="str"
// :msg="str"  @update:msg="str=$event"

const str = ref('测试语法糖')
const str1 = ref('对比数据')
const cahngeFn = (val: string) => {
  str1.value = val
}
</script>

<template>
  <div class="home-page">
    home
    <comA v-model="count"></comA>
    <comA :modelValue="count" @update:modelValue="count = $event"></comA>
    --------------------------------------------------------

    <comB v-model:msg="str" :str1="str1" @changeStr="cahngeFn"></comB>

    <comB :msg="str" @update:msg="str = $event"></comB>
  </div>
</template>

<style lang="scss" scoped></style>
